<!DOCTYPE html>
<html>
<head>
<title>录入VIP客户</title>
</head>
<body>
	<header>
		<h1>录入VIP客户</h1>
	</header>
	<main>
	 <form action="vip/add.do" method="post">
        <p>
            <label>*手机号:<input name="mobile"  placeholder="将作为VIP编号"></label>
        </p>
        <p>
            <label>*会员等级:
            	<select id="rankSelect" name="rankId">
            	</select>
            </label>
        </p>
        <p>
            <label>*姓名:<input name="name" ></label>
        </p>
        <p>
            <label>*性别:</label>
            <label>
            <input  name="sex" type="radio" value="1" checked>男
            </label>
            <label>
            <input  name="sex" type="radio" value="0"}>女
            </label>
        </p>
        <p>
            <label>生日:<input type="date"  name="birthday"></label>
        </p>
        <p>
            <label>QQ:<input name="qq" ></label>
        </p>
        <p>
            <label>Email:<input name="email"></label>
        </p>
        <p>
            <label>邮编:<input name="zipCode"></label>
        </p>
        <p>
            <label>邮寄地址:<input name="address" ></label>
        </p>
        <p>
            <label>备注:<textarea name="remark"></textarea></label>
        </p>
        <p>
            <button id="submitBtn" type="submit">确定</button>
         	<a href="javascript:history.back()">返回</a>
        </p>
    </form>
    </main>
    <script src="/static/js/jquery.js"></script>
    <script src="/static/js/yi.toast.js"></script>
    <script>
    	//网页加载完毕获取等级列表
    	$(function(){
    		$.getJSON("/rank/list.do",function(resp){
    			if(resp.code!=="ok"){
    				toast("加载等级列表失败，请联系管理员");
    				return;
    			}
    			let list=resp.data; 
    			/**
    			[{id:1,name:'普通会员'},{id:2,name:'黄金会员'}...]
    			*/
    			paintRankSelect(list);
    		})
    	});
    	const paintRankSelect=function(list){
    		let select=$("#rankSelect");
    		for(let rank of list){
    			$("<option/>")
    			.attr("value",rank.id)
    			.text(rank.name).appendTo(select);	
    		}
    	};
     	const paintRankSelect1=function(list){
    		let select=document.getElementById("rankSelect");
    		for(let rank of list){
    			let rankOption=document.createElement("option");
    			rankOption.id=rank.id;
    			rankOption.textContent=rank.name;
    			select.appendChild(rankOption);
    				
    		}
    	};
    	$("form").submit(function(evt){
    		$("#submitBtn").prop("disabled",true);
    		evt.preventDefault();
    		
    		$.post("/vip/add.do",$(this).serialize(),function(resp){
    			if(resp.code!=="ok"){
    				toast(resp.message);
    				return;
    			}
    			alert("成功!");
    			
    		}).always(function(){
    			$("#submitBtn").prop("disabled",false);
    		});
    		
    	});
    </script>
</body>
</html>